<template>
	<view style='height:100vh;'>
		<view class="user-head">

			<view class="u-flex user-box u-p-b-30">
				<view style="width: 25%;margin: 79px auto;" @click="()=>{
					if (!phone) {
						loginBtn()
					} else {
						goToDetail('/privateMsg/user/inchphoto')
					}
				}">
					<view class="u-m-l-30 u-m-t-18">
						<image class="img_sex" :src="
						    userSex == 1 ? 'https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/male.png'
						   :userSex == 2 ?'https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/female.png'
						   : ''
						  "></image>
						<u-avatar :src="pic" size="130"></u-avatar>
					</view>
					<view style="font-size: 17px;margin-top: -18px;margin-left: 61px;">
						<image style="width: 18px;height: 18px;" :src="identity == '业主' ? ownerImg : tenantImg" mode="">
						</image>
					</view>
				</view>
			</view>

			<view class="u-m-r-20 login-info" @click="loginBtn" style="width: 100%;margin-top: -100px;">
				<view class="u-font-14 name flex justify-center"
					style="color: #fff;text-align: center;font-size: 28rpx;margin-top:10px">
					<view v-if="!phone" class="pt-1 pb-1 pl-2 pr-2 rounded-4" style="border:2rpx solid #fff;">
						{{!phone?'点击登录':''}}
					</view>
				</view>
				<view class="u-font-10 user-huany" style="text-align: center;font-size: 20px;">
					<view v-if="!phone" style='color: orange;font-size: 32rpx;'>欢迎来到助业业主平台</view>
					<view v-if="hourseStr">
						<view style="margin-bottom: 10px;font-weight: 600;letter-spacing: 2.5px;">
							{{name}}
						</view>
						<view style="font-size: 17px;">
							{{hourseStr.buildDistrictCode}}-{{hourseStr.buildTowerCode}}-{{hourseStr.roomUnitNumber}}-{{hourseStr.roomCode}}
						</view>
					</view>
				</view>
			</view>

			<view class="zhicheng" v-if="hourseStr">
				<text class="right-text">{{hourseStr.proName || '业主认证'}}</text>
			</view>
			<view class="zhicheng-score" @click="goToScore" v-if="hourseStr && hourseStr.proName"
				style="display: flex;padding: 5px;">
				<text style="color: gold;font-size: 18px;">★</text>
				<text style="color: gold;margin-left: 8px;">
					{{proScore}}
				</text>
				<text style="margin-left: 3px;color: white;">分</text>
			</view>
		</view>
		<view style="width: 100%;margin-top: -110px;">
			<view
				style="width: 93%;margin: -27px auto; background: #FFFFFF;height: 116px;border-radius: 6px;padding-top: 14px;">
				<view class='index_vajra_district_box' v-for="(item,index) in vajraArray" :key="index"
					@click='tapName(item)'>
					<image mode="widthFix" :src="item.imgUrl" />
					<text style="color: #666666;">{{item.name}}</text>
				</view>
			</view>
		</view>

		<view class="u-m-t-60" style="margin: 0 30rpx;border-radius: 6px;">
			<u-cell-group>
				<view class="cont-list" @click="toHouse">
					<image class="image" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/house2.png"></image>
					<view >我的房产</view>
					<image class="right" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/right.png"></image>
				</view>
				<view class="cont-list" @click="goToDetail('/my/mine/manual')">
					<image class="image" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/manual.png"></image>
					<view>助业业主App使用手册</view>
					<image class="right" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/right.png"></image>
				</view>
				<view class="cont-list" @click="complaintBtn">
					<image class="image" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/tousu.png"></image>
					<view>投诉管理</view>
					<image class="right" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/right.png"></image>
				</view>
				<view class="cont-list" @click="toRepart">
					<image class="image" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/baoxui.png"></image>
					<view>维修记录</view>
					<image class="right" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/right.png"></image>
				</view>
				<view class="cont-list" @click="goToDetail('/my/score/score')">
					<image class="image" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/score.png"></image>
					<view>物业评分</view>
					<image class="right" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/right.png"></image>
				</view>
				<view class="cont-list" @click="goToDetail('/my/setUp/setUp')">
					<image class="image" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/seting.png"></image>
					<view>设置</view>
					<image class="right" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/right.png"></image>
				</view>
			</u-cell-group>
		</view>
	</view>
</template>

<script>
	export default {
		onShow() {
			let _this = this;
			let rawData = uni.getStorageSync('rawData');
			if (rawData) {
				console.log(rawData.userHeadPortrait)
				_this.pic = rawData.userFrontHeadPortrait
				_this.name = rawData.userName
				_this.phone = rawData.userTel
				_this.userSex = rawData.userSex
				_this.login = true
			} else {
				_this.pic = 'http://clhy-img.oss-cn-beijing.aliyuncs.com/venusImage/2022-07-26/1658831108773.png'
				_this.name = null
				_this.phone = null
				_this.userSex = null
				_this.login = false
			}
			this.hourseNum = uni.getStorageSync('hourseNum') || 0
			if (this.phone) {
				this.getHouseList()
			}
			//this.$closeInvite()
		},
		onPullDownRefresh() {
			let _this = this;
			let rawData = uni.getStorageSync('rawData');
			if (rawData) {
				_this.pic = rawData.userHeadPortrait
				_this.name = rawData.userName
				_this.phone = rawData.userTel
				_this.userSex = rawData.userSex
				_this.login = true
			} else {
				_this.pic = 'http://clhy-img.oss-cn-beijing.aliyuncs.com/venusImage/2022-07-26/1658831108773.png'
				_this.name = null
				_this.phone = null
				_this.userSex = null
				_this.login = false
			}
			this.hourseNum = uni.getStorageSync('hourseNum') || 0
			if (this.phone) {
				this.getHouseList()
			}
			//this.$closeInvite()
		},
		data() {
			return {
				ownerImg: 'https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/owner2.png',
				tenantImg: 'https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/tenant.png',
				identity: null,
				identityTenant: null,
				proScore: 0,
				pic: 'https://clhy-img.oss-cn-beijing.aliyuncs.com/logo/avatar.jpg',
				show: true,
				login: false,
				phone: null,
				name: null,
				userSex: 1,
				sweixin: null,
				vajraArray: [
					{
						index: '2',
						name: '房屋档案',
						imgUrl: 'https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/house1.png',
						link: '/my/information/informationindex'
					},
					{
						index: '3',
						name: '租售管理',
						imgUrl: 'https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/andsale1.png',
						link: '/my/rentsale/rentsaleindex'
					},
					{
						index: '4',
						name: '车位管理',
						imgUrl: 'https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/parking1.png',
						link: '/my/car/car'
					},
					{
						index: '5',
						name: '账单',
						imgUrl: 'https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/bill1.png',
						link: '/homePage1/bill/bill'
					},
				],
				hourseList: null,
				hourseStr: null,
				hourseNum: 0, //选择第几个房间
			}
		},
		onLoad() {
			this.homelist = uni.getStorageSync('hourseList')[uni.getStorageSync('hourseNum') || 0]
		},

		methods: {
			// 切换房屋
			estate() {
				this.$Router.push({
					path: '/pages/switch/switch'
				})
			},
			//获取房屋信息
			async getHouseList() {
				let res = await this.$request.api.house({
					mobile: uni.getStorageSync('phone') || this.phone
				})
				console.log(res)
				//查询是否存在自己租的房屋
				let res2 = await this.$request.api.getProByMobile({
					mobile: uni.getStorageSync('phone') || this.phone
				})
				if (res.data.data.projectList.length > 0) {
					this.hourseList = res.data.data.projectList
					this.hourseStr = uni.getStorageSync('projectItem')
					this.hourseStr = this.hourseList[this.hourseNum || 0]
					console.log(this.hourseStr)
					uni.setStorageSync('hourseList', res.data.data.projectList)
					this.housingFlag = true
					//2022-9-5，查询该项目评分
					this.getProScore();

					//身份
					this.identity = '业主'
				} else if (res2.data.data.projectList.length > 0) {
					this.hourseList = res2.data.data.projectList
					this.hourseStr = uni.getStorageSync('projectItem')
					this.hourseStr = this.hourseList[this.hourseNum || 0]
					console.log(this.hourseStr)
					uni.setStorageSync('hourseList', res2.data.data.projectList)
					this.housingFlag = true
					//2022-9-5，查询该项目评分
					this.getProScore();

					//身份
					this.identity = '租户'
				} else {

					this.housingFlag = false
				}
				uni.stopPullDownRefresh()
			},
			getProScore() {
				this.$request.api.getPostitionScoreInfo({
					selectType: 2,
					id: this.hourseStr.proId
				}).then(res => {
					if (res.data.data.score) {
						this.proScore = res.data.data.score;
					} else {
						this.proScore = 0
					}
				})
			},
			// 金刚区切换
			tapName(item) {
				if (item.index == 1 || item.index == 2) {
					uni.navigateTo({
						url: item.link
					})
				} else if (item.index == 3) {
					//2023-08-29  修改房屋租售跳转逻辑(如果有租售信息  跳转租售详情页面  无则调整添加页面)   zwl  
					this.$request.api.leaseAndSale({
						room_id: this.homelist.roomId,
					}).then(res => {
						if (res.data.data.room_id) {
							uni.navigateTo({
								url: '/my/rentsale/detailrentsale?id=' + res.data.data.id
							})
						} else {
							uni.navigateTo({
								url: '/my/rentsale/release'
							})
						}
					})

				} else {
					uni.navigateTo({
						url: item.link
					})
				}
			},
			goToScore() {
				uni.navigateTo({	
					url: '/my/score/score'
				})
			},
			// 获取登录信息
			loginBtn() {
				if (!this.phone) {
					uni.navigateTo({
						url: '/privateMsg/login/logins'
					})
				}
			},
			loginOut() {
				let _this = this
				uni.clearStorage();
				this.phone = null;
				this.name = null;
				// 进入首页
				_this.$Router.pushTab({
					path: '/pages/index/index'
				})
			},
			//跳转到投诉页面
			complaintBtn() {
				this.$Router.push({
					path: '/my/complaint/complaintList'
				})
			},
			toHouse() {
				this.$Router.push({
					path: '/homePage1/house/house'
				})
			},
			// 跳转到车位
			toCar() {
				uni.navigateTo({
					url: '/my/car/car'
				})
			},
			goToDetail(url) {
				uni.navigateTo({
					url: url
				})
			},
			// 缴费
			toJiao() {
				this.$Router.pushTab({
					path: '/homePage1/pay/pay'
				})
			},
			toRepart() {
				this.$Router.push({
					path: '/my/repairList/repairList'
				})
			}
		}
	}
</script>
<style lang="scss">
	.zhicheng-score {
		position: absolute;
		top: 210rpx;
		right: 5px;
		height: 37px;
		line-height: 37px;
		text-align: center;
		font-weight: 500;
		font-size: 28rpx;
	}

	.right-text-socre {
		margin-left: 10px;
		font-size: 16px;
		margin-right: 10px;
		font-weight: 600;
	}

	.right-text {
		margin-left: 10px;
		font-size: 16px;
		margin-right: 10px;
		font-weight: 600;
	}

	.img_sex {
		width: 20px;
		height: 20px;
		position: absolute;
		text-align: center;
		margin-left: 55px;
		z-index: 10;
		margin-left: 49px;
		margin-top: -2px;
	}

	.popup-all {
		background: #F5F5F5;
		padding: 13px 20px;
		.share-detail {
			width: 17%;
			padding: 13rpx;
			margin: 0rpx 0rpx 54rpx 40rpx;
			text-align: center;

			.image-all {
				width: 100rpx;
				height: 100rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				background: #FFFFFF;
				border-radius: 16rpx;
				image {
					width: 74rpx;
					height: 74rpx;
				}
			}
			.font {
				margin-top: 12rpx;
				font-size: 22rpx;
				font-weight: 400;
				color: #999999;
				width: 51px;
			}
		}

		.fx {
			text-align: center;
			padding: 16rpx 0rpx 24rpx 0rpx;
			font-size: 26rpx;
			font-weight: 400;
			color: #999999;
		}
		.cancel {
			height: 114rpx;
			background: #FFFFFF;
			text-align: center;
			font-size: 36rpx;
			font-weight: 400;
			color: #333333;
			line-height: 114rpx;
		}
	}
	.u-cell {
		position: relative;
		display: flex;
		box-sizing: border-box;
		width: 100%;
		padding: 56rpx 26rpx;
		font-size: 15px;
		line-height: 26px;
		color: #606266;
		background-color: #fff;
		text-align: left;
	}

	.user-head {
		height: 365px;
		background-size: 100% 100%;
		background-repeat: no-repeat;

		 background: linear-gradient(180deg, #76D904 0%,#417505 100%);
		.login-info {
			.name {
				font-size: 32rpx;
				color: #FFFFFF;
				margin-bottom: 16px;
			}

			.user-huany {
				font-size: 24rpx;
				color: #FFFFFF;
			}
		}

		.user-logo-bang {
			width: 178rpx;
			height: 162rpx;
			border-radius: 0px 50% 50% 0px;
			background: rgba(255, 255, 255, .6);
		}
	}

	.cont-list {
		display: flex;
		align-items: center;
		padding: 0 20rpx;
		height: 110rpx;
		border-bottom: 1px solid #f2f2f2ab;
		font-size: 16px;
		font-weight: bold;
		.image {
			width: 30px;
			height: 28px;
			margin-right: 16px;
		}
		.right{
			width:12px;
			height: 16px;
			float: right;
			margin-left: auto;
		}
	}

	.zhicheng {
		display: flex;
		position: absolute;
		top: 150rpx;
		right: 0;
		height: 37px;
		background: #FFFFFF;
		border-radius: 100rpx 0px 0px 100rpx;
		line-height: 37px;
		text-align: center;
		font-weight: 500;
		color: #427705;
		font-size: 28rpx;
	}

	.index_vajra_district_box {
		width: 174rpx;
		height: 150rpx;
		display: inline-block;
		text-align: center;
	}

	.index_vajra_district_box image {
		width: 120rpx;
		margin: auto;
	}

	.index_vajra_district_box text {
		display: inline-block;
		width: 100%;
		font-size: 28rpx;
		color: #FABE4B;
		text-align: center;
	}
</style>